<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <title>汽车购票系统</title>
    <link rel="stylesheet" href="../css/frozen.css">
    <link rel="shortcut icon" href="../img/carTitlePicture.jpg"/>
    <style>
        .secBox>li{
            border-bottom:1px solid rgba(128, 128, 128, 0.51);
        }
        .carInitialsUl div{
            padding:0.08rem;
            border-radius: 0.05rem;
        }
        #goTime{
            color: #1AB6EF;
        }
        #insurance{
            color: #1AB6EF;
        }
        .checkDiv{
            border-bottom:1px solid #1AB6EF;
            position: relative;
            padding: 0.2rem;
        }
        .routeTip{
            text-align: center;
            color: gray;
            font-size: 12px;
            position: absolute;
            width: 25%;
            left: 0;
            right: 0;
            bottom: -0.1rem;
            margin: auto;
            z-index: 1;
            background-color: white;
        }
        .latelyRouteUl>li{
            border-bottom:1px solid rgba(128, 128, 128, 0.51);
            font: 10px "微软雅黑";
            padding-left: 0.1rem;
        }
        .ui-poptips{
            width: 100vw;
            height: 40vh;
            position: fixed;
            right: 0;
            bottom: 0;
            margin: auto;
            display: none;
        }
    </style>
</head>
<body ontouchstart="">
<header class="ui-header ui-header-positive  ">
    <h1 style="font-size: 0.3rem">车票预定</h1>
</header>
<footer class="ui-footer ui-footer-btn">
    <ul class="ui-tiled ui-border-t">
        <li data-href="index.html" class="ui-border-r" style="background-color: #18B4ED"><div style="color: #fffefe">车票预订</div></li>
        <li data-href="ui.html" class="ui-border-r jumpOne"><div>订单查询</div></li>
        <li data-href="js.html" class="jumpTwo"><div>我的信息</div></li>
    </ul>
</footer>
<section class="ui-container">
    <ul class="ui-list-text border-list secBox">
        <!--车站选择-->
        <li class="ui-border-b">
            <ul class="ui-row-flex">
                <li class="ui-col ui-flex ui-flex-pack-end"><div class="startSeat station" xixi="135" style="font-size: 30px">西昌</div></li>
                <li class="ui-col ui-flex ui-flex-pack-center"><div><i class="ui-icon-refresh changeSeat" style="font-size: 50px;color:#18B4ED "></i></div></li>
                <li class="ui-col ui-flex ui-flex-pack-start"><div class="endSeat station" xixi="246" style="font-size: 30px">成都</div></li>
            </ul>
        </li>
        <!--出发时间、日期、保险费（元）-->
        <li class="ui-border-b">
            <div class="ui-form ui-border-t" >
                <form action="#">
                    <div class="ui-form-item ui-border-b">
                        <label>出发日期</label>
                        <div class="ui-select-group">
                            <div class="ui-select">
                                <select id="myYear">

                                </select>
                            </div>
                            <div class="ui-select">
                                <select id="myMonth">

                                </select>
                            </div>
                            <div class="ui-select">
                                <select id="myDay">

                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="ui-form-item ui-form-item-show ui-border-b">
                        <label for="goTime">出发时间</label>
                        <select name="" id="goTime" style="margin-left: 95px">
                            <option value="">00:00--24:00</option>
                            <option value="">00:00--06:00</option>
                            <option value="">06:00--12:00</option>
                            <option value="">12:00--18:00</option>
                            <option value="">18:00--24:00</option>
                        </select>
                    </div>
                </form>
            </div>
        </li>
        <!--汽车开头选项-->
        <li class="ui-border-b">
            <ul class="ui-row-flex carInitialsUl">
                <li class="ui-col ui-flex ui-flex-pack-center"><div hehe="false" xixi="全部">全部</div></li>
                <li class="ui-col ui-flex ui-flex-pack-center"><div hehe="false" xixi="k">k头</div></li>
                <li class="ui-col ui-flex ui-flex-pack-center"><div hehe="false" xixi="T">T头</div></li>
                <li class="ui-col ui-flex ui-flex-pack-center"><div hehe="false" xixi="G">G头</div></li>
                <li class="ui-col ui-flex ui-flex-pack-center"><div hehe="false" xixi="S">S头</div></li>
                <li class="ui-col ui-flex ui-flex-pack-center"><div hehe="false" xixi="其他">其他</div></li>
            </ul>
        </li>
        <!--查询按钮-->
        <li class="ui-border-b" style="padding:0.15rem 0 ">
            <div class="ui-btn-wrap checkDiv" >
                <button class="ui-btn-lg ui-btn-primary">
                    查询
                </button>
                <div class="routeTip">最近常用路线</div>
            </div>
        </li>
        <!--常用路线-->
        <li class="ui-border-b" style="border-bottom: none">
            <ul class="ui-list-text border-list latelyRouteUl">
            </ul>
        </li>
    </ul>

    <!--提示框-->
    <div class="ui-poptips ui-poptips-warn closeTip">
        <div class="ui-poptips-cnt"><i></i>温馨提示</div>
        <div class="ui-poptips-cnt" style="text-align: left"><span id="tipSection">请输入用户名</span></div>
        <div class="ui-poptips-cnt"><button class="ui-btn continueLookUp" >确定</button></div>
    </div>
</section>
<script src="../lib/zepto.main.1.20.js"></script>
<script src="../lib/NEWzepto.tocuh.js"></script>
<script src="../js/frozen.js"></script>
<script src="../js/myDateGet.js"></script>
<script src="../js/boookTicket.js"></script>
<script>
    $('.jumpOne').on('tap',function(){
        location.href="query.html";
    });
    $('.jumpTwo').on('tap',function(){
        location.href="yourselfNews.html";
    });
</script>
</body>
</html>